<!DOCTYPE html>
<html manifest="/manifest/pano.appcache">
<head>
    <title><%= title%></title>
    <meta name="keywords" content="chingkun,bigpixel,giga pixel,"/>
    <meta name="description" content="<%= description%>" />
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta http-equiv="x-ua-compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="stylesheet" href="/stylesheets/panotpl-ngrunning.css">
</head>
<body>

    <div id="pano-container"></div>
    <div class="slider-left slider-box">

    </div>
    <div class="slider-right slider-box"></div>

    <!--标注粉丝-start-->
    <div class="comment-modal-mobile   wx_n" >
        <p style="float: left" class="no_wx_p hidden">微信中打开才能留言哟!</p>
        <a href="javascript:void(0);" class="no_wx_cancel hidden cancel" style="float: right">知道了</a>
        <ul class="comment_ul">
            <li ><a href="javascript:void(0);" class="login">授权登录</a></li>
            <li><a href="javascript:void(0);" class="cancel">取消</a></li>
        </ul>

    </div>
    <div class="comment-modal-mobile   wx_y" >
        <div class="runner-input">
            <a href="javascript:void(0);" class="runner_tag_btn fl">选手标注</a>
            <div class="runner-info fr">
                <input type="text" class="runner_input runner_num" placeholder="填写您的编号" maxlength="6"/>
                <input type="text" class="runner_input runner_name" placeholder="填写您的姓名" maxlength="6"/>
            </div>
        </div>
        <div style="overflow: hidden;">
            <input type="text" class="user_text" placeholder="你想要说的话" />
            <ul class="comment_ul">
                <li class="comment_li"><a href="javascript:void(0);" class="cur sure">确定</a></li>
                <li><a href="javascript:void(0);" class="cancel">取消</a></li>
            </ul>
        </div>

    </div>
    <!--标注粉丝-end-->
    <!--男粉与女粉列表页-start-->
    <div class="fans_list_box">
        <div class="fans_hd">
            <ul class="fans_head">
                <li class="fans_head_cur woman_btn"><span>女粉</span><spna class="icon-venus"></spna></li>
                <li class="man_btn"><span>男粉</span><spna class="icon-mars"></spna></li>
            </ul>
            <div class="fans_list_close"><span class="icon-close"></span></div>
        </div>
        <div class="list_inner">
            <div class="fans_bd">
                <ul id="fans_list_woman" class="fans_list">
                </ul>
                <ul id="fans_list_man" class="fans_list">

                </ul>
                <div class="pullUp_woman pullUp">
                    <span class="icon-spinner"></span><span class="pullUpLabel">加载更多...</span>
                </div>
                <div class="pullUp_man pullUp">
                    <span class="icon-spinner"></span><span class="pullUpLabel">加载更多...</span>
                </div>
            </div>
        </div>
        <div class="add_height" ></div>
    </div>

<script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://cdn.bigpixel.cn/libs/krpano/1.18.5/tour.js"></script>
<script src="http://cdn.bigpixel.cn/gpx/ngrunning/scripts/bigpixel.ngrunning.min.js"></script>
<script src="http://cdn.bigpixel.cn/gpx/ngrunning/scripts/ngrunners.js"></script>

<script>
    var panoinfo = {panoid:'<%= panoid%>', title:'<%= title%>', description:'<%= description%>', tourxmlpath:'<%= tourxmlpath%>'};
    var socialinfo = {
        title:"<%= title%>",
        desc:"<%= description%>",
        link:window.location.href.replace(window.location.hash, ''),
        imgUrl:'<%= iconPath%>'
    };

    var woman_flag=true;
    var man_flag=true;
    var woman_page=0;
    var man_page=0;
    var pullUp_man_flag=false;
    var pullUp_woman_flag=false;
    var active_who_page=true;
    //初始化全景视图
    function initPanoview(){
        bpsviewer=new BigPixelViewer(panoinfo.tourxmlpath,panoinfo.panoid);
        document.bpsviewer=bpsviewer;
        bpsviewer.embed();
        bpsviewer.UserTags.OnReceivedRandomTags(function(tags){
            ShowRandomTags(tags);
        });

        bpsviewer.UserTags.Init(panoinfo.panoid);
        //setTimeout("initUserTags",1000);
        setTimeout("bpsviewer.UserTags.getUserTagsDataWorker()",3000);

        //OnUserinfoReadyFunc
        $.bigpixel.OnUserinfoReady(function(){
            if($.bigpixel.isLoggedIn())
            {
                setTimeout("hidewelcome()",500);
                setTimeout("looktoAfterStarted()",1800);
            }
        });
        setTimeout("resetWechat()",1000);
    }

    function initUserTags()
    {
        bpsviewer.UserTags.Init(panoinfo.panoid);
    }

    function hidewelcome()
    {
        bpsviewer.set('plugin[cover_hei].visible',false);
        bpsviewer.set('layer[scroll].visible',false);
        bpsviewer.set('layer[start_btn].visible',false);
    }

    setInterval(function(){
        bpsviewer.UserTags.getRandomTagsDataWorker();
    },20000);
    //显示底问滚动头像
    function ShowRandomTags(tags)
    {
        //console.log(tags.length)
        var slider_html_left='';
        var slider_html_right='';
        $(".slider-left").html('');
        $(".slider-right").html('');
        while(tags.length > 0)
        {
            var tag_left = tags.pop();  //删除最后一个并返回这个元素
            var tag_leftstr = JSON.stringify(tag_left);

            if(tag_left){
                slider_html_left+='<div class="slider" onclick=\'bpsviewer.UserTags.looktoTag(' + tag_leftstr + ')\'><img src="'+tag_left.avatarurl+'"/></div>';
            }

            if(tags.length > 0)
            {
                var tag_right = tags.pop();
                var tag_rightstr = JSON.stringify(tag_right);
                if(tag_right != undefined && tag_rightstr != undefined) {
                    slider_html_right+='<div class="slider" onclick=\'bpsviewer.UserTags.looktoTag(' + tag_rightstr + ')\'><img src="'+tag_right.avatarurl+'"/></div>';
                }
            }
        }
        $(".slider-left").append(slider_html_left  );
        $(".slider-right").append(slider_html_right  );
        var stage_w=$(window).width();
        var slide_width;
        if(stage_w<500){
            var slide_num=stage_w>330?3:2;
        }
        if(slide_num){
            slide_width= ((stage_w-130)/2)/slide_num;
        }
        $(".slider").css("width",slide_width);
        $(".slider img").css("height",slide_width);
    }

    $(document).ready(function(){
        $.bigpixel.initWechat();
        initPanoview();

        //取消按钮按下
        $(".cancel").click(function(){
            nav_show();
            $(".wx_n").slideUp(100);
            $(".wx_y").slideUp(100);
            bpsviewer.call("set(hotspot[tagger].visible,false);");
        });
        //输入框输入内家时
        $(".user_text").bind("input propertychange",function(){
            if($(this).val().length>0){
                $(".comment_ul .comment_li a").removeClass("cur");
            }else{
                $(".comment_ul .comment_li a").addClass("cur");
            }
        });
        //授权登录按钮按下
        $(".comment_ul .login").on('click',function(){
            $.bigpixel.login();
        });
        //当标注点要说的内容写完，按确定按钮时：user_openid是存在的，
        $(".comment_ul .comment_li .sure").click(function(){

            //判断是否跑者
            var ngrunner_num=$(".runner_num").val();
            var ngrunner_relly_name=$(".runner_name").val();
          var user_note=$(".user_text").val();
          if(user_note.length == "")
          {
            $(".user_text").focus();
            return;
          }

          if(ngrunner_num != "" && ngrunner_relly_name != "")
          {
            if(ngrunners.exists(ngrunner_num,ngrunner_relly_name))
            {
              var attached = {code:ngrunner_num,name:ngrunner_relly_name};
              bpsviewer.UserTags.saveNewtag(user_note,attached);
            }
            else
            {
                $(".runner_num").val("");
                $(".runner_name").val("");
                $(".runner-info").css('display','none');
              var msg = '选手信息错误';
              alert(msg);
              return;
            }
          }
          else
          {
            bpsviewer.UserTags.saveNewtag(user_note);
          }
          $(".runner_num").val("");
          $(".runner_name").val("");
          $(".user_text").val("");

        });
        $(".runner_tag_btn").click(function(){
           $(".runner-info").css('display','block');
            //$(".runner-info").slideDown(100);
        });
    //显示标注自己想说的话的input框-end

    //女粉丝按钮点击
    $(".woman_btn").click(function(){
        active_who_page=true;
        $("#fans_list_woman").css("display","block");
        $("#fans_list_man").css("display","none");
        $(".pullUp_man").css("display","none");
        if(pullUp_woman_flag){
            $(".pullUp_woman").css("display","table");
        }else{$(".pullUp_woman").css("display","none");}
        $(this).addClass("fans_head_cur").siblings().removeClass("fans_head_cur");
    });
    //男粉丝按钮点击
    $(".man_btn").click(function(){
        active_who_page=false;
        $(".pullUp_woman").css("display","none");
        if(pullUp_man_flag){
            $(".pullUp_man").css("display","table");
        }else{$(".pullUp_man").css("display","none");}
        if(man_flag){
            bpsviewer.UserTags.create_male_list();
            $("#fans_list_woman").css("display","none");
            $("#fans_list_man").css("display","block");
        }else{
            $("#fans_list_man").css("display","block");
            $("#fans_list_woman").css("display","none");
        }
        $(this).addClass("fans_head_cur").siblings().removeClass("fans_head_cur");
    });
    //男女粉丝列表关闭
    $(".fans_list_close").click(function(){
        $(".fans_list_box").css("display","none");
        bpsviewer.call("set(plugin[cover_hei].visible,false);");
    });

    //列表页滚动条滚动到底部触发事件-start
    var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
    var nScrollTop = 0; //滚动到的当前位置
    $(".list_inner").scroll(function(){
        var nDivHight = $(".fans_list_box .list_inner").height();
        var nDivHight_game = $(".game_list_box .list_inner").height();
        nScrollHight = $(this)[0].scrollHeight;
        nScrollTop = $(this)[0].scrollTop;
        if((nScrollTop + nDivHight) >= nScrollHight){
            if(active_who_page){
                //console.log('滚动触发女粉');
                woman_page++;
                $(".pullUp_woman").addClass('loading'); $(".pullUp_woman .pullUpLabel").html('Loading...');
                bpsviewer.UserTags.create_female_list();
            }else{
                //console.log('滚动触发男粉');
                man_page++;
                $(".pullUp_man").addClass('loading'); $(".pullUp_man .pullUpLabel").html('Loading...');
                bpsviewer.UserTags.create_male_list();
            }
        }

    });
    //列表页滚动条滚动到底部触发事件-end


    });
    //点击标注自己执行函数
    function tag_area(){
        bpsviewer.UserTags.showdialog();
    }

    //生面粉丝列表
    function create_fans_list(){
        $(".fans_list_box").css("display","block");
        bpsviewer.call("set(plugin[cover_hei].visible,true);");
        if(woman_flag){
            bpsviewer.UserTags.create_female_list();
        }
    }
    //导航栏隐藏
    function nav_hidden(){
        bpsviewer.call('set(plugin[tag_home_btn].visible,false);');
    }
    //导航栏显示
    function nav_show(){
        bpsviewer.call('set(plugin[tag_home_btn].visible,true);');
    }
    //刷新留言
    function refreshTags(){
        bpsviewer.UserTags.getUserTagsDataWorker();
        bpsviewer.UserTags.refreshTags();
    }


    function initWechatShare()
    {
        if(!$.bigpixel.isLoggedIn())
        {
            $.bigpixel.initWechat();
        }
    }

    function gocommentpage(){
        window.location.href = "/panos/" + panoinfo.panoid + "/comment";
    }

    //重置分享链接
    function resetWechat()
    {
        if($.bigpixel.isLoggedIn())
        {
            var ta = '他';
            if($.currentUser.gendar == "2")
            {
                ta = "她";
            }
            bpsviewer.UserTags.getTaginfoByUserId($.currentUser._id,function(taginfo)
            {
                if(taginfo)
                {
                    socialinfo.title = $.currentUser.nickname + "分享了" + ta + "在" + socialinfo.title + "中的位置";
                }
                else
                {
                    socialinfo.title = $.currentUser.nickname + "分享了" + socialinfo.title;
                }
                socialinfo.link = $.updateUrlParams(socialinfo.link,"shareid", $.currentUser._id);
                $.bigpixel.initWechat();
            });
        }
        else
        {
            $.bigpixel.initWechat();
        }
    }

    function convertTaginfo(data)
    {
        var _taginfo = {};
        _taginfo.id = "usertag" + data._id;
        _taginfo.ath = data.ath;
        _taginfo.atv = data.atv;
        _taginfo.fov = data.fov ;
        if(typeof(data.userinfo) == "object" )
        {
            _taginfo.avatarurl =  data.userinfo.headimgurl;
        }
        else
        {
            _taginfo.avatarurl = "/images/noavatar@96x96.jpg";
        }

        _taginfo.title = data.title;
        _taginfo.note = data.note;

      if(data.attached != undefined && typeof(data.attached) == "string")
      {
        _taginfo.attached = JSON.parse(data.attached);
      }
      else if (data.attached != undefined && typeof(data.attached == "object") )
      {
        _taginfo.attached = data.attached;
      }
        return _taginfo;
    }
//读取当前的链接上的shareid,如果没有读取当前的用户，如果_uid不为空，则looktoTag
function looktoAfterStarted()
    {
        var _uid = $.getUrlParam('shareid');
        if(_uid == null && $.bigpixel.isLoggedIn())
        {
            _uid = $.currentUser._id;
        }

        if(_uid != null)
        {
            bpsviewer.UserTags.getTaginfoByUserId(_uid,function(taginfo){
                console.log('getTaginfoByUserId --begin');
                console.log(taginfo);
                console.log('getTaginfoByUserId --end');
                if(taginfo != null)
                {
                    bpsviewer.UserTags.looktoTag(taginfo);
                }
            });
        }
    }

</script>
    <!-- 谷歌、百度统计代码 -->
    <script>
        (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-56983622-1');ga('send', 'pageview');
        var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "//hm.baidu.com/hm.js?00e4d98773c02201bbd493815c0cb964"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s);})();
    </script>
</body>
</html>
